<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title></title>
		<style type="text/css">
			canvas{border: 1px solid #333;}
		</style>
	</head>
	<body>
		<canvas width="600" height="400"></canvas>
	</body>
	<script type="text/javascript">
		let canvas=document.querySelector("canvas");
		let ctx=canvas.getContext("2d");
		
		//添加阴影
		ctx.shadowColor="red"
		ctx.shadowOffsetX=50;
		ctx.shadowOffsetY=50;
		ctx.shadowBlur=10
		
		//矩形
		ctx.fillRect(200,100,100,200)
		
		
		
		
	</script>
</html>